<template>
    <div>
        <div class="toExamine" v-if="!customer">
            <router-link 
                :to="`/detail?appointmentId=${item.appointmentId}`" 
                v-for="(item, index) in list" 
                :key="index">
                <div class="toexamineCon">
                <div style="width: 65%;">
                    <el-row>
                        <el-col :span="4">事由：</el-col>
                        <el-col :span="20" v-text="item.subjectMatter"></el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="4">单位：</el-col>
                        <el-col :span="20" v-text="item.affiliatedUnits"></el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="4">姓名：</el-col>
                        <el-col :span="8" v-text="item.fullName"></el-col>
                        <el-col :span="4">手机：</el-col>
                        <el-col :span="8" v-text="item.tel"></el-col>
                    </el-row>
                </div>
                <div class="examineIcone">
                    <img v-if="item.status == 0" width="70" height="56" src="../../assets/wait.png" alt="待审核">
                    <img v-else-if="item.status == 1" width="70" height="56" src="../../assets/pass.png" alt="已通过">
                    <img v-else-if="item.status == 2" width="70" height="56" src="../../assets/reject.png" alt="拒绝">
                    <img v-else-if="item.status == 9" width="70" height="56" src="../../assets/leave.png" alt="已离开">
                    <img v-else-if="item.status == 8" width="70" height="56" src="../../assets/noleave.png" alt="未离开">
                </div>
            </div>
            </router-link>
        </div>
        <Jurisdiction v-else/>
    </div>
</template>

<script>
import { fetchPost } from '../../util';
export default {
    components: {
        Jurisdiction: () => import("../Jurisdiction/Jurisdiction.vue")
    },
    data() {
        return {
            list: [],
            customer: sessionStorage.getItem("customer") === '访客' ? true : false
        }
    },
    mounted() {
        fetchPost('/api/customerAppointment/selList', {
            pageNum: 1,
            pageSize: 200,
            customerId: sessionStorage.getItem('customerId'),
        }).then(data => {
            if(data.code === 0) {
                this.list = data?.rows;
            }
        })
    }
}
</script>

<style scoped>
    .toexamineCon{
        background: #FFFFFF;
        padding: 16px 10px;
        color: #666666;
        line-height: 22px;
        font-size: 12px;
        display: flex;
        margin-bottom: 16px;
    }
    .examineIcone {
        display: flex;
        flex: 1;
        justify-content: center;
        align-items: center;
    }
</style>